<template>
  <div style="display:inline;width:100%">
    <span>
      {{content}}
    </span>
    <span class="el-icon-document-copy" style="cursor:pointer" @click="toCopy"></span>
  </div>
</template>

<script>
export default {
  name:'Copy',
  data(){
    return{
      content:''
    }
  },
  props:['copy'],
  watch:{
    copy(newval){
      this.content = newval
    }
  },
  mounted(){
    this.content = this.copy
  },
  methods:{
    toCopy(){
      const input = document.createElement('input');
      document.body.appendChild(input);
      input.setAttribute('value', this.content);
      input.select();
      if (document.execCommand('copy')) {
        this.$msg({
          type:"success",
          message:'复制成功'
        })
      }
      document.body.removeChild(input);
    }
  }
}
</script>

<style scoped lang="scss">
.copy{
  cursor: pointer;
}
</style>